@import '~iview/src/styles/index.less'; // 引入ui库样式表
@import './reset'; // 引重置样式库
@import './variables.less';

.ivu-form .ivu-form-item-label {
  padding: 10px 0 10px 0;
}

.hide {
  display: none !important;
}
.show {
	display: block !important;
}
.clear:before, .clear:after, .clearfix:before, .clearfix:after {
	content: ' ';
	display: table;
}
.clear:after, .clearfix:after {
	clear: both;
}
.pull-left {
	float: left;
}
.pull-right {
	float: right;
}
.relative {
	position: relative;
}
.absolute {
	position: absolute;
}
.table {display: table !important; table-layout: fixed; width: 100%;}
.table-row {display: table-row !important;}
.table-cell, .cell {display: table-cell !important; vertical-align: middle;}
.vertical-top {vertical-align: top !important;}
.text-left {text-align: left !important;}
.text-center {text-align: center !important;}
.text-right {text-align: right !important;}
.word-break-all {word-break: break-all;}

.no-padding-lr {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.empty:empty {
	display: table !important;
	width: 100%;
	height: 80px;
	text-align: center;
	&:before {
		display: table-cell;
		vertical-align: middle;
		content: attr(tip);
		font-size: 12px;
		color: #999;
	}		
}

.ml10 {margin-left: 10px;}
.ml20 {margin-left: 20px;}
.mr5 {margin-right: 5px;}
.mr10 {margin-right: 10px;}
.mr20 {margin-right: 20px;}
.mt2 {margin-top: 2px;}
.mt5 {margin-top: 5px;}
.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}
.mt50 {margin-top: 50px;}
.mt60 {margin-top: 60px;}
.mt70 {margin-top: 70px;}
.mb(@px) {
  margin-bottom: @px;
}

.mb20 {
  .mb(20px);
}
.mb30 {
  .mb(30px);
}

.wp50 {width: 50%;}
.text-fixed {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.pointer {cursor: pointer;}

.page-wrapper {
  margin-top: 20px;
  text-align: center;
  .page-container {
    display: inline-block;
  }
}

.operation-container {
  button {
    &:not(:last-child) {
      margin-right: 10px;
    }
  }
}

.fill-height-select {
  .ivu-select-selection {
    opacity: 0;
    height: 100% !important;
  }
}

.visible-table {
  overflow: visible !important;
  .ivu-table {
    overflow: visible;
    .ivu-table-cell {
      overflow: visible;
    }
  }
}
.ivu-table-tip {
  overflow-x:  hidden !important;
}

.dropdown-menu {
  .ivu-dropdown-item {
    &:hover {
      background: #583d3d !important;
      color: #fff !important;
    }
  }
  .drop-item {
    position: relative;
    padding: 0 0 0 20px;
    line-height: 20px;
    > i {
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
      font-size: 16px;
    }
  }
}

.menu {
  .ivu-menu-submenu-title {
    span {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-width: 110px;
    }
    .ivu-icon-ios-arrow-down {
      right: 4px !important;
    }
  }
  .ivu-menu {
    .ivu-menu-item {
      > div {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
    }
  }
}

.single-page-title {
  font-size: @page-title-font-size;
  line-height: 32px;
  padding-right: 10px;
  float: left;
  /* 默认最多12个字 */
  max-width: 170px;
  color: @primary;
  .text-fixed;
}

// ---------------------------------------table-------------------------------------------------
.ivu-table-header {
  color: #333;
  font-weight: 600;
  font-size: 12px;
}
.ivu-table-body {
  color: #333;
  font-size: 12px;
  .ivu-table-row-hover {
    td {
      background-color: #ebf7ff !important;
    }
  }
  .row-checked {
    td {
      background-color: #ebf7ff !important;
    }
  }
}
// .ivu-table-body {
//   moz-user-select: -moz-none;
//   -moz-user-select: none;
//   -o-user-select:none;
//   -khtml-user-select:none;
//   -webkit-user-select:none;
//   -ms-user-select:none;
//   user-select:none;
// }
.check-all {
  width: 50px;
  height: 40px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  .checkbox {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
// ---------------------------------------table-------------------------------------------------

.primary-item {
  color: @primary;
  cursor: pointer;
}

.checkbox-column-n(@n) {
  .ivu-checkbox-group-item {
    width: 100% / @n;
    overflow: hidden;
    margin-right: 0;
  }
}

.checkbox-column-4 {
  .checkbox-column-n(4);
}

// ---------------------------------------menu-------------------------------------------------
.horizontal-menu-container {
  width: 100% !important;
  height: 70px !important;
  ul.ivu-menu {
    position: static !important;
    &:after {
      bottom: 10px !important;
    }
  }
}
.__rail-is-horizontal {
  z-index: 900 !important;
  bottom: 0 !important;
}
.__bar-is-horizontal, .__bar-is-vertical {
  background: rgb(193, 193, 193) !important;
}
// ---------------------------------------menu-------------------------------------------------

// ---------------------------------------modal-------------------------------------------------
.form-scroll {
  .__view {
    padding: 0 100px !important;
  }
  .tail {
    height: 1px;
  }
}
// ---------------------------------------modal-------------------------------------------------

.color(@color) {
  color: @color;
}
.red {
  .color(red);
}
.primary {
  .color(@primary)
}

.row-title {
  position: relative;
  height: 32px;
  margin-bottom: 20px;
  &:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 1px;
    width: 100%;
    background: #ddd;
  }
  &:after {
    content: attr(content);
    position: absolute;
    bottom: 2px;
    left: 0;
    background: #fff;
    font-size: 18px;
    color: @primary;
  }
}

.footer-btn-container {
  text-align: center;
  button {
    &:not(:first-child) {
      margin-left: 10px;
    }
  }
}

.error-name {
  padding: 0 10px;
  color: @tip-font-color;
}

.radio-group {
  .ivu-form-item-content {
    line-height: 29px;
  }
}

// ---------------------------------Select-----------------------------------
.ivu-select {
  .ivu-select-dropdown {
    max-height: 150px !important;
  }
}
// ---------------------------------Select-----------------------------------

// ---------------------------------Select-----------------------------------
.ivu-dropdown-item-divided:before {
  margin-right: 0 !important;
  display: none;
}
// ---------------------------------Select-----------------------------------

.login-container {
  .ivu-form-item-label {
    font-size: 16px;
    line-height: 50px;
    padding-top: 0;
    padding-bottom: 0;
  }
  .ivu-input {
    font-size: 16px;
    height: 50px;
    padding: 0 20px;
  }
}

@media screen and (max-width: 540px) {
  .top-right-container {
    display: none;
  }
}